READ ME version "BETA 2"

REMERCIEMENT

Tout d'abord, je tiens à remercier la communauté coppermine en général et la communauté francophone en particulier.
Je tiens également à remercier particulièrement, Pascal YAP, François Keller et Elwood J. Blues, pour leurs réponses au centaines de questions que je me suis posé lors de la réalisation de ce thème, et auquel ils m'ont répondu de manière indirect, grâce à leur nombreux posts sur ce forum...
Je tiens à signaler que le post qui m'a permit de venir à bout de la réalisation de ce thème et qui au final aura répondu à toutes mes attentes est celui-ci. http://www.gnurou.org/writing/smartquestionsfr. Merci à François Keller de me l'avoir fait découvrir en version française... Ce fut mon roadbook !


POURQUOI CE THÈME

Intéressé par coppermine depuis longtemps, j'ai fini par le tester il y a quelques semaines. Malheureusement, je n'ai pas trouvé mon bonheur dans les thèmes que j'ai pu tester de ci de là...
Je me suis donc plongé dans la création d'un thème perso pour coppermine.

Le reproche que je fesais aux thèmes que j'avais visionné était le manque de place sur la page pour avoir une photo la plus grande possible sans avoir à scroller pour la visionner ou accéder au film strip. En effet par défaut dans coppermine tous les éléments s'empilent les uns sur les autres et finissent par prendre de la hauteur...
Je navigue en 1280x1024, je souhaitais donc pouvoir visionner des images intermédiaires (bordure comprise) en 1024x682 (format 2/3 donc) sans scroll.

QUELQUES ÉLÉMENTS D'INFORMATIONS À PROPOS DE CE THÈME

Ce thème prend tout son sens avec des images intermédiaires de grandes tailles, supérieures à 600px de hauteur

Il s'inspire de plusieurs thèmes, je ne saurais vous les citer tous, mais des boutons proviennent de meltingfilm_left et du code d'un peu partout.

Les éléments de la page ont donc été réorganisés de la façon suivante, afin d'optimiser la place disponible pour la photo.

- Le bandeau/header a été réduit à 50 pixels. Il contient entre autre le choix des thèmes, le menu admin.

- Le chemin d'accès à la galerie (breadcrumb) a été intégré dans le bandeau.

- Le menu a été déplacé à gauche.

- le filmstrip (négatif), qui apparait dans la page displayimage.php a été placé sous le menu à gauche. Je vous conseille de le limiter à trois images afin de le voir sans scrool dans un maximum de résolution. C'est paramétrable dans "configuration - vue des images - nombre de vignettes dans le négatif" : 3.

- le choix de la langue est placé en bas de page.

- il faut également dans la configuration de coppermine, "Vue des images" - "Largeur de la table pour l'affichage des fichiers" modifier le paramètre, 600 par défaut, et le passer à 100%

- Pour profiter pleinement du thème, il faut installer cpmfetch. La fonction theme_main_menu() a été modifiée pour afficher une image au hasard (grâce à cmpfetch) en dessous du menu, afin d'agrémenter les pages autre que la page displayimage.php. cpmfetch doit être installé dans le dossier cpmfetch à la racine de coppermine, mais est optionnel, l'image au hasard ne s'affichera pas si vous n'avez pas installé cpmfetch.


RÉSOLUTION DES PHOTOS - ATTENTION UTILISATION DE JAVASCRIPT POUR AFFICHER LES PHOTOS INTERMÉDIAIRES...
Le thème adapte la hauteur de la photo en fonction de la hauteur de la résolution de l'écran du visiteur.

- 1024 C'est la hauteur de résolution écran que j'ai pris comme point de départ, il y a encore peu de personnes qui utilisent des résolutions supérieures, et puis cela me parait un bon compromis entre taille et poids de l'image pour les images intermédiaires.
Pour avoir des images sans scroll, l'idéal est de définir dans les paramètres de coppermine :
"configuration - paramètres des images et vignettes "
* dimension maximale pour les vignettes : 100 (vous pouvez mettre moins, personnellement j'aime les grandes vignette, évitez de mettre plus)
* utiliser la dimension : hauteur
* largeur ou hauteur maximale pour une image/vidéo intermédiaire : 682
Avec ces paramètres, pour des images au format 2/3, et dans une résolution de 1280*1024, vous pouvez les avoir sans scroll en 1024x682 en paysage et en 454x682 en portrait (bordure comprise dans la résolution).

- Pour les résolutions supérieures, les images intermédiaires resteront par défaut à la hauteur maxi que vous avez défini dans coppermine, dans mon cas 682. Mais vous avez la possibilité d'autoriser l'étirement des images en allant modifier les paramètres de la fonction theme_html_picture(). Voir FAQ

- Pour les résolutions inférieures, votre navigateur affichera l'image intermédiaire mais réduite pour s'adapter à la page.

Les réglages par défaut sont dans le tableau ci-dessous. Ils sont différents d'une résolution à l'autre car plus la résolution est petite, et moins en régle générale on affiche de barre dans le navigateur...
L'objectif est de déterminer le nombre de pixel utilisé par ces différentes barres pour savoir combien il nous reste de place maximum pour afficher la photo.
Je parle en résolution verticale.
Ces chiffres sont complètement arbitraires, à vous de les changer si vous n'êtes pas d'accord, donnez moi SVP vos retour car je n'ai pas la possibilité, le temps de tester toutes les résolutions.

comprendre le tableau :
* résolution verticale - nombre de pixels vertical à enlever de la résolution verticale = reste pour l'image : résolution type : éléments de la fenêtre comptabilisé : explication

* 480 - 140 = 340 : (640x480 - 800x480) : en plein écran, sans barre personnelle, sans les onglets : Non ce n'est pas une résolution désuète. C'est le cas du eeepc 701 par exemple qui affiche 800*480. Je pars du principe que les utilisateurs de ce genre de résolution connaissent la touche F11 de leur navigateur qui supprime barre de titre, barre de menu, barres personnelles, on obtient donc environ 140 pixels utilisés en hauteur par les deux barres restantes, barre d'outil du navigateur et barre de tache de l'OS, plus le bandeau du site 50 pixels, et un peu de marge, plus les bordures, la place restant disponible est environ 480-140=340. 340 sera la hauteur d'une photo affichée sur un écran ayant une résolution de 640x480 ou 800x480. Vous pouvez modifier le nombre de pixel à enlever de la résolution, ici 140, dans la fonction theme_html_picture(), augmentez le, et la photo sera plus petite, diminuez le et la photo sera plus grande pour cette résolution d'écran. Notez qu'en 640x480, il nous manquera de la largeur...

* 600 - 280 = 320 : (800x600 - 1024x600) : sans barre personnelle sans les onglets : C'est le cas du eeepc 900 qui affiche 1024x600.

* 768 - 300 = 468 : (1024x768) : sans barre personnelle sans les onglets : Une résolution standard encore beaucoup utilisée pour les écrans 14", 15", voir 17".

* 800 - 300 = 470 : (1280x800) : avec une barre personnelle sans les onglets : C'est la résolution des portables 15.4", à partir de cette résolution on peut raisonnablement afficher en permanence une barre personnelle.

* 864 - 300 = 564 : (1152x864) : avec barre personnelle sans les onglets : une résolution, pour les écrans 15" et 17".

* 900 - 240 = 630 : (1440x900) : avec barre personnelle sans les onglets : C'est la résolution des portables 17".

* 960 - 340 = 620 : (1280x960) : avec une barre personnelle et onglets : à partir de cette résolution on peut raisonnablement afficher en permanence les onglets.

* au delà - 365 = 659 : (1280x1024 - 1600x1200 - ...) : avec une ou plusieurs barres personnelles et onglets : Par défaut l'image ne grandira plus si vous augmentez la résolution écran.

Vous êtes tout à fait libre de choisir une hauteur différente pour vos images intermédiaires (paramètre coppermine), plus grande ou plus petite.
Vous êtes également libre de modifier la taille des images en fonction des résolutions (changer le "nombre de pixel vertical à enlever de la résolution verticale"), voir rajouter d'autres résolutions (connaissance minimum en programmation pour rajouter une condition dans une fonction) voir FAQ.


RESTE À FAIRE
- débugger
- commenter plus largement et plus proprement le code et en anglais
- mettre le film strip au dessus du menu ou réduire la taille des thumbnails du filmstrip, pour les petites résolutions
- mettre une bordure sur l'image de présentation de l'album
- une version sans javascript


FAQ
* Comment enlever la bordure blanche ?
Il suffit d'éditer le fichier style.css, et de mettre 0px à l'attribut margin des styles, .image pour les thumbnails, et .image_big pour les images intermédiaires.

* Comment enlever l'ombre des photos ?
- version simple : supprimer les images cadre_X.gif du dossier images du thème.
- version propre : éditer thème.php, et enlever le code qui crée le tableau d'ombrage.
function theme_main_menu : pour image au hasard
$template_film_strip : pour le film strip
$template_thumbnail_view : pour les thumbnails
$template_display_media : pour l'affichage de l'image en taille intermédiaire

* Comment permettre l'agrandissement des images intermédiaires plus petites que la résolution du navigateur le permet ?
dans theme.php dans function theme_html_picture(), dans la section de code sous le commentaire : /*javascript permettant de modifier la taille de l'image en fonction de la résolution, si l'image intermédiaire est l'image la plus grande disponible*/ enlever toutes les conditions commençant par "if(screen.height-".$resXXX.">".$taillemax.")" (n'oubliez pas pas le } de fin de condition)

* comment modifier le nombre de pixel enlevé à la résolution écran pour déterminer la taille de l'image ?
dans le fichier theme.php, dans function theme_html_picture() et dans la function theme_slideshow() sous le commentaire "NOMBRE DE PIXEL À ENLEVER POUR DÉTERMINER LA RÉSOLUTION DE LA PHOTO", vous trouverez les variables à modifier en fonction de la résolution
$res480='140';
$res600='280';
$res768='300';
$res800='330';
$res864='300';
$res900='270';
$res960='370';
$res1024='365';

BUGS

Bugs résolus par rapport à la version précédente "BETA 1".

* Suppression du curseur de survol des images.

* Supression de la légère réduction des images lors d'un survol de celle-ci à la souris

* Résolution du problème d'affichage des boutons du menu de gestion des albums

* Correction des couleurs au niveau du survol sur les textes

* Le breadcrumb n'a plus besoin d'être désactivé dans les paramètres de coppermine, il reste donc disponible pour les autres thèmes.

* Résolution du problème d'affichage des bordures sous IE

* Résolution du problème d'agrandissement des images lorsque la résolution d'écran permettait un affichage intermédiaire plus important que la taille de l'image.

* Résolution du problème de bordures plus ou moins large sur certain navigateur.


Bugs ouverts.
* De plus l'affichage dépasse la largeur de l'écran (17 pouces résolution 1440 x 900)
- ouvert
En attente de retour d'un testeur, je n'ai pas accès à cette résolution.
voir : FAQ
* comment modifier le nombre de pixel enlevé à la résolution écran pour déterminer la taille de l'image ?

* Si il s'avère que le dossier contenant CpmFetch ne porte pas le nom /cpmfetch/, le script provoque alors une FATAL ERROR bad path to cpmfetch !
- ouvert
Attentes d'un retour d'information plus précises. Le bug ne se produit pas chez moi.

* En cas de changement de paramètres coppermine pour la taille maxi des images, le javascript se basant sur ce paramètre, cela risque de déformer les images anciennes.
- solution "Mettre à jour les vignettes et/ou les photos redimensionnées" dans l'utilitaire de coppermine.

* Le code javascript permettant l'ouverture de l'image taille réelle à partir de l'image intermédiaire ne fonctionne pas.
- solution : pas pour le moment

* Lors du lancement d'un slide show, la taille des images est déterminée par la première photo. Si elle est de taille inférieure, à ce que la résolution permet, les autres photos seront aussi afficher en plus petite taille. Si elle est supérieur, les photos intermédiaires de plus petites tailles seront agrandies 
- solution : pas pour le moment (évitez de mélanger des photos de tailles différentes dans un même album).

* Opéra : problème de bordure lors du défilement d'un slide show avec des images de tailles différentes. 
- solution : pas pour le moment (évitez de mélanger des photos de tailles différentes dans un même album).

* cliquer sur l'image au hasard provoque une erreur : Not Found
- solution : pas pour le moment

Toutes les critiques sont les bienvenue, bonnes comme mauvaises.

RedMorgan@free.fr